<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>css样式-字体</title>
</head>

<body>
    <!-- font-style 字体风格 -->
    <p style="font-style: normal;">font-style: normal字体风格正常</p>
    <p style="font-style: italic;">font-style: normal字体风格斜体</p>
    <p style="font-style: oblique;">font-style: normal字体风格倾斜</p>

    <!-- font-weight 字体粗细 -->
    <p style="font-weight: normal;">font-weight: normal 字体粗细正常</p>
    <p style="font-weight: bold;">font-weight: normal 字体粗细加粗</p>
    <p style="font-weight: bolder;">font-weight: normal 字体粗细更粗</p>
    <p style="font-weight: 100;">font-weight: normal 字体粗细数值100-900</p>

    <!-- font-size 字体大小 -->
    <p style="font-size: smaller;">font-size:smaller 字体大小smaller</p>
    <p style="font-size: large;">font-size:smaller 字体大小large</p>
    <p style="font-size: 200%;">font-size:smaller 字体大小百分比</p>
</body>

</html>